<template>
    <div class="goodsitem" @click="godetail">
            <img v-lazy="showimg" alt="" :key="item.iid">
            <div>
                <p class="desc">{{item.title}}</p>
                <div class="info-footer">
                    <span class="price">{{item.price}}</span>
                    <img src="@/assets/img/home/get.png" alt="" v-if="true">
                    <img src="@/assets/img/home/geta.png" alt="" v-else>
                    <span class="collect">{{item.cfav}}</span>
                </div>
            </div>
    </div>
</template>

<script>
export default {
    props:{
        item:{
            type:Object
        }
    },
    computed:{
        showimg()
        {
            return this.item.image || this.item.show.img;
        }
    },
    methods: {
        godetail(){
            this.$router.push('/detail/'+this.item.iid)
        }
    },

}
</script>

<style scoped>
.goodsitem{
    margin: 10px 0px;
    box-sizing: border-box;
    background-color: #eee;
    border-radius: 5px;
    width: 45%;
    
}
.desc{
    margin-top: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow:ellipsis;
    font-size: 12px;
}
 img{
    width: 100%;
}
.info-footer{
    margin-top: 10px;
    display: flex;
    justify-content:center;
    align-items: center;
}
.info-footer img{
    width: 16px;
    margin-right: 6px;
}
.price{
    color: deeppink;
    margin-right: 10px;
}
</style>